// import * as ReactDOM from 'react-dom';
// import App from 'App';

// const container = document.getElementById('app');

// // Create a root.
// const root = ReactDOM.createRoot(container);

// // Initial render: Render an element to the root.
// root.render(<App tab="home" />);

// // During an update, there's no need to pass the container again.
// root.render(<App tab="profile" />);

// import * as ReactDOM from 'react-dom';

// import { Fragment, useState, Element } from 'react'
import React, { useEffect } from 'react';
import { createRoot } from 'react-dom/client';
import { BrowserRouter as MyRouter, Routes, Route } from 'react-router-dom';
import { RecoilRoot } from 'recoil';
import { MainRouter } from './route'
import App from './App';
import './index.less';

const container: any = document.getElementById('root');
const root = createRoot(container);

root.render(
  <React.StrictMode>
    <RecoilRoot>
      <MyRouter>
        <Routes>
          {/* { 不是嵌套就需要尾部加上 * } */}
          <Route path="/*" element={<App />} />
          {
            MainRouter.map((route: any) => {
              return <Route key={route.path} path={route.path} element={route.element} />
            })
          }
        </Routes>
      </MyRouter>
    </RecoilRoot>
  </React.StrictMode>
);
